let data = {
    name: "hdf",
    age: 19,
    friend: {
        name: "zwl"
    }
};

//? observer -> defineReactive(内部defineProperty) 要递归
//? 数据变为响应式
observer(data)
function observer(target) {
    if (!target || typeof target !== 'object') return target
    for (const key in target) {
        defineReactive(target,key,target[key])
    }
}
function defineReactive(target,key,value) {
    //? 深度监听 主要是key的值可能还是一个Object
    observer(value)
    Object.defineProperty(target,key,{
        get() {
            //? 获取到数据 做一些操作 理论上应该是加入dep
            console.log('get',value)
            return value
        },
        set(newValue) {
            //? 把新的数据变成响应式
            observer(newValue)
            console.log('newValue',newValue) //? zzz
            console.log('value',value)   //? zwl
            //? 改变了数据
            if (newValue !== value) {
                //? 执行更新
                value = newValue;
                //? 触发dep中所有
                console.log("更新视图");
            }
        }
    })
}

console.log('get log',data.friend.name)
console.log('set log',data.friend.name = 'zzz')
console.log('get log',data.friend.name)
